<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    // ES6 箭头函数   
    // ES6 允许使用“箭头”（=>）定义函数。  函数简写

    // 普通函数改写箭头函数的步骤:
    // 1. 将普通函数改为匿名函数 => 所有的箭头函数都是匿名函数
    // 2. 省略function关键词 在小括号之后 添加 =>
    // 3. 如果形参有且只有一个  小括号可以省略
    //    a. 如果没有参数或形参超过一个 小括号不能省略
    //    b. 如果形参有默认值,解构赋值 小括号不能省略
    // 4. 如果执行语句只有一条 且是return语句  => 省略 {} 和 return
    //    a. 如果函数的返回值是一个对象 => 省略后会出问题 => 给对象包裹()


    // 普通函数
    function sum(a, b) {
        console.log(a, b);
        return a + b;
    }

    //  1. 将普通函数改为匿名函数 => 所有的箭头函数都是匿名函数
    var sum = function (a, b) {
        console.log(a, b);
        return a + b;
    }

    //  2. 省略function关键词 在小括号之后 添加 =>
    var sum = (a, b) => {
        console.log(a, b);
        return a + b;
    }

    // 3. 如果形参有且只有一个  小括号可以省略

    // 不能省略
    // var sum = (a, b) => { // 参数大于1
    //     console.log(a, b);
    //     return a + b;
    // }

    // var sum = () => {  // 没有参数
    //     return 10;
    // }

    // var sum = (a = 0) => {  // 一个参数 => 给它设置了默认值
    //     return a * 10;
    // }

    // 可以省略
    // var sum = (a) => {  // 一个参数 => 给它设置了默认值
    //     console.log(a);
    //     return a * 10;
    // }

    // 省略后
    // var sum = a => {  // 一个参数 => 给它设置了默认值
    //     console.log(a);
    //     return a * 10;
    // }

    // console.log(sum(10));

    // 4. 如果执行语句只有一条 且是return语句  => 省略 {} 和 return

    // var sum = a => {  // 两条执行语句 => 不能省
    //     console.log(a);
    //     return a * 10;
    // }

    // 可以省略
    // var sum = a => {  // 两条执行语句 => 不能省
    //     return a * 10;
    // }

    // 简写:
    // var sum = a => a * 10;

    var fn = v => ({ num: v });
    console.log(fn(10));







</script>

</html>